<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
  <title>我的在线简历</title>
  <link rel="stylesheet" href="cv.css">
  <link rel="stylesheet" href="//at.alicdn.com/t/font_1940954_0gfryoueez7q.css
">
</head>

<body>
  <header>
    <img src="https://i.loli.net/2020/07/13/CEDNL8spyntHY41.png" alt="" class="avator">
    <h1>otto</h1>
    <p>前v5战队职业选手</p>
  </header>
  <main>
    <div class="column-1">
      <div class="wrap box-1">
        <div class="iconfont icon-information"></div>
        <h2>基本信息</h2>
        <ul class="detail">
          <li>
            <span class="iconfont icon-phone"></span>
            17826802670</li>
          <li>
            <span class="iconfont icon-wecheat"></span>
            WA_WAY</li>
          <li>
            <span class="iconfont icon-email"></span>
            335968838@qq.com
          </li>
          <li>
            <span class="iconfont icon-education"></span>
            大专
          </li>
        </ul>
      </div>
      <div class="wrap">
        <div class="iconfont icon-skill"></div>
        <h2>掌握技能</h2>
        <ul class="detail">
          <li>掌握HTML5/CSS3，熟悉传统布局、Flex布局、Grid布局、移动端适配等</li>
          <li>熟悉Vue技术栈如Vue-Router、Vuex、Vue-CLI及相关流行库的使用，理解其重要概念</li>
          <li>熟悉React / Redux技术栈等使用，能够使用React进行基本开发</li>
          <li>熟悉前后端交互技术JSONP、AJAX，了解fetch</li>
          <li>熟悉Node.js开发，能搭建基础后台开发</li>
        </ul>
      </div>
      <div class="wrap">
        <div class="iconfont icon-map"></div>
        <h2>技能图谱</h2>
        <dl class="detail">
          <dt>Javascript
          <dd><span class="bar" style="width: 30%"></span></dd>
          </dt>
          <dt>CSS3
          <dd><span class="bar" style="width: 60%"></span></dd>
          </dt>
          <dt>Node
          <dd><span class="bar" style="width: 20%"></span></dd>
          </dt>
          <dt>Vue
          <dd><span class="bar" style="width: 80%"></span></dd>
          </dt>
          <dt>React
          <dd><span class="bar" style="width: 90%"></span></dd>
          </dt>

        </dl>


      </div>
    </div>
    <div class="column-2">
      <div class="wrap-2 box-1">
        <div class="iconfont icon-school"></div>
        <h2>教育经历</h2>
        <ul class="detail">
          <li>
            <span class="time">09/2014~07/2017</span>
            <h3>艾利斯顿商学院</h3>
            <span class="profession">工商企业管理</span>
            <p>多次获得校一等奖学金，成绩排名专业前10%。</p>
          </li>
          <li>
            <span class="time">09/2014~07/2017</span>
            <h3>艾利斯顿商学院</h3>
            <span class="profession">工商企业管理</span>
            <p>多次获得校一等奖学金，成绩排名专业前10%。</p>
          </li>
        </ul>

        </ul>



      </div>

      <div class="wrap-2">
        <div class="iconfont icon-work"></div>
        <h2>工作经历</h2>
        <ul class="detail">
          <li>
            <span class="time">09/2014~07/2017</span>
            <h3>浙江耀阳新材料科技有限公司</h3>
            <span class="profession">销售助理</span>
            <ul class="content">
              <li>项目介绍： 该项目的目的是搭建线上学习平台，把线下课堂的完整学习流程搬到线上，平台包括课程展示、购买、直播、录播、作业、权限管理、停课复课、试听等几十个大功能。该项目采用前后分离的技术方案，
                我主要负责前端部分的开发。项目前端部分使用Vue技术栈，移动端平台使用自己实现的vue ui组件库。</li>
              <li>技术栈：vue、vue-router、vuex、element-ui、typescript、webpack、es6、移动端</li>
              <li>项目成果: 项目支撑饥人谷日常教学活动、运营活动的正常开展，支持数千学生的日常线上学习，几十万用户的日常访问。</li>
            </ul>


          </li>
        </ul>
      </div>
      <div class="wrap-2">
        <div class="iconfont icon-project"></div>
        <h2>项目经历</h2>
        <ul class="detail">
          <li>
            <span class="time">09/2014~07/2017</span>
            <h3>写代码啦</h3>
            <span class="profession">销售助理</span>
            <ul class="content">
              <li>项目介绍： 该项目的目的是搭建线上学习平台，把线下课堂的完整学习流程搬到线上，平台包括课程展示、购买、直播、录播、作业、权限管理、停课复课、试听等几十个大功能。该项目采用前后分离的技术方案，
                我主要负责前端部分的开发。项目前端部分使用Vue技术栈，移动端平台使用自己实现的vue ui组件库。</li>
              <li>技术栈：vue、vue-router、vuex、element-ui、typescript、webpack、es6、移动端</li>
              <li>项目成果: 项目支撑饥人谷日常教学活动、运营活动的正常开展，支持数千学生的日常线上学习，几十万用户的日常访问。</li>
            </ul>
          </li>
        </ul>
      </div>
    </div>

  </main>

</body>

</html>